April, 2024
The Travelers 🛫
Role
UX Designer
Timeline
12 Weeks
Team
4 Designers
Tools
Figma, Miro, User Research
Overview
Our goal is to make an app where all the users' needs for travel are in one place and to make traveling more fun and less of a hassle. Making the flight process easier while also bringing up affordable prices for hotels and car rentals in the area that are easily accessible.
Guiding Principles
At BankSupplies we serve highly specialized audiences, including banks, credit unions, and casinos. Many of these customers and potential customers start their journey with informational searches rather than product searches.
- Make traveling easier for the average users so that they are less likely to be stressed before their vacation.
- A seamless vacation planning app that keeps the user in control of their flight times and the places they stay at.
Project Outcome
- Created a centralized travel planning experience.
- Reduced friction between booking flights, hotels, and transportation.
- Designed responsive website and mobile concepts.
- Validated design decisions through competitor analysis.
User Persona
To esnure the group was designing for the right group, we created a User Persona for somebody who might use the app. We predicted the user will be over 18, willing to travel, and interested in faster ways to book flights, stays, and transportation.
Screenshot of the User Persona "Jane Doe".
Competitor Analysis
As a group we completed a competitive analysis among top travel sites, noting the pro's and con's of each. My work was with Expedia and the Kayak application.
Pros:
Expedia
- Has a wide range of filtering options so the user can specialize their search.
- Provides an extensive list of flights, cars, etc.
- On the mobile version the organization and color coding makes the buttons easily distinguishable for the user.
Travelocity
- Easy for first time users.
- When you fill out information it saves when you go back to look for something else.
- The mobile version is very user friendly and useful when looking for a place to stay or things to do in your area.
Kayak
- “Good to know” section and “Featured Tips” provides users with extra travel information specific to them.
- Overall design is simple and welcoming.
- On the mobile version there are helpful tools such as “Price Alerts”, “Measure Bag”, and a “Flight Tracker”.
Orbitz
- Provides the user with recommended travel plans. Also have the option to create your own plans.
- The mobile version has advanced features such as light, dark, and auto mode. It’s also easy for the user to change settings such as currency, language, and region.
Cons:
Expedia
- The same promotional content is displayed under the six main nav tabs.
- Focuses on informing users of the “packages” and “deals” that they offer. Specifically on the app the cancelation process is non-intuitive.
Travelocity
- Padding was messed up at some locations in the site.
- Does not generate many flight options.
- Each page on the app, while organized, has a different look. App also has problems with light and dark mode, and the “Cruises” section.
Kayak
- No autofill when searching for flights, places to stay, cars, etc. Doesn’t account for typos or misspelling.
- Main nav bar was broken.
- The mobile version has a built in game for users but is hidden in the account settings.
Orbitz
- Website and application lack disability services.
- The design is generic and has no special features.
- The Website and mobile version have the same design and features.
Key Features and Processes
After going over the comparative analysis as a group, we identified key features and processes we wanted to include in our wireframes:
- A wide range of filtering options and personalized settings.
- Tools for the user such as price alerts, featured tips, bag measurement, and a flight tracker.
- Improved cancellation/payment processes.
- Assistance creating travel plans beginning to end.
Lo-Fi Wireframes
I created these initial Lo-Fi wireframes for the website. Hannah created the Lo-Fi wireframes for the app version.
First Lo-Fi from the ExploreEase app.
Second Lo-Fi from the ExploreEase app.
Third Lo-Fi from the ExploreEase app.
Fourth Lo-Fi from the ExploreEase app.
Fifth Lo-Fi from the ExploreEase app.
Figma Wireframes
One we had the Lo-Fi wireframes dialed in, we moved on to creating High fidelity wireframes in Figma. This time we focused less on the checkout process. I was again in charge of creating the wireframes for the website version and Hannah did the app version.
View Interactive Figma Wireframes →
First Wireframe from the ExploreEase app.
Second Wireframe from the ExploreEase app.
Third Wireframe from the ExploreEase app.
Fourth Wireframe from the ExploreEase app.
Fifth Wireframe from the ExploreEase app.
Sixth Wireframe from the ExploreEase app.
Seventh Wireframe from the ExploreEase app.
Eighth Wireframe from the ExploreEase app
Design Decisions
- We wanted to improve the way users find a flight.
- Combined users flights, hotels, and car rentals into one place.
- Easy access to the flights that were already purchased by the users.
- The user being able to find place they stayed at previously.
Reflection
This project strengthened my understanding of travel-related user workflows and the importance of balancing business goals with user needs.
If I continued the project, I would conduct usability testing with travelers and iterate on the booking flow based on real user feedback.
Resources
- Covert, A. (2014). How to Make Sense of Any Mess. Abby Covert.
- Marquis, L. M. (2019). Everyday Information Architecture. A Book Apart.
- Martin, C. (2022, August 11). 13 Reasons Traveling Can Stress You Out & Tips To Reduce Travel Stress. Neuvana. Retrieved November 30, 2023, from https://neuvanalife.com/blogs/blog/13-reasons-traveling-can-stress-you-out-tips-to-reduce-travel-stress
- Meadows, D. H. (2008). Thinking in Systems. Chelsea Green Publishing.